<template>
  <view class="chacttop" v-if="hlistdata">
    <view class="chactop-top">
      <!-- .CorpName  -->
      <text>{{ hlistdata.CorpName }}</text>
      <!-- <text style="padding: 0rpx 20rpx;"> {{hlistdata.JobName}} </text> -->
    </view>
    <view class="chactopnrtext">
      <view
        class="chactopnr-textview"
        @click="vupopupshow(item)"
        v-for="(item, key) in tberlist"
        :key="key"
      >
        <image :src="item.src" :style="item.style" />
        <view class="viewtext">{{ item.text }}</view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    hlistdata: {
      type: Object,
    },
  },
  data() {
    return {
      tberlist: [],
    };
  },
  created() {
    this.tberlist = [
      {
        id: 1,
        text: "手机号",
        src: "/static/timimges/shoji.png",
        style: "width: 35rpx; height: 40rpx",
      },
      {
        id: 2,
        text: "微信",
        src: "/static/timimges/wxx.png",
        style: "width: 46rpx; height: 41.53rpx",
      },
      {
        id: 3,
        text: "简历",
        src: "/static/timimges/shenqing.png",
        style: "width: 34rpx; height: 41rpx;",
      },
    ];
  },
  methods: {
    vupopupshow(item) {
      this.$emit("vupopupshow", item.id);
    },
  },
};
</script>

<style lang="scss" scoped>
.chacttop {
  background-color: #fff;
  padding: 10rpx;

  .chactop-top {
    display: flex;
    font-size: 24rpx;
    text-align: center;
    justify-content: center;
  }

  .chactopnrtext {
    display: flex;
    text-align: center;
    justify-content: space-between;
    padding: 10rpx 30rpx;

    .chactopnr-textview {
      flex: 1;

      .viewimgs {
      }

      .viewtext {
        font-size: 20rpx;
      }
    }
  }
}

.scroll-H {
  border: 1px solid red;
  padding: 10rpx;
  box-sizing: border-box;
  white-space: nowrap;
  width: 100%;
  white-space: nowrap;

  .scrollHstyle {
    width: 100rpx;
    border: 1px solid green;
    display: inline-block;
    width: 150rpx;
    text-align: center;
  }
}
</style>